<template>
  <div class="abnormal-behavior-type">
    <div class="chart" id="abnormalBehaviorTypePie"></div>
  </div>
</template>
<script>
import * as echarts from 'echarts'
export default {
  name: 'AbnormalBehaviorType',
  methods:{
    initChart(){
      const chart=echarts.init(document.getElementById('abnormalBehaviorTypePie'))
      const option={
        color:['#6E45F3','#CA3EF1','#6ECDE5','#2147F3','#FAAD14','#52C41A'],
        tooltip: {
          trigger: 'item'
        },
        series: [
          {
            name: '异常行为类型',
            type: 'pie',
            center:['50%','40%'],
            radius: '70%',
            label: {
              show: true,
              color: '#32B4FF',
              formatter: '{b}: {d}%'
            },
            labelLine: {
              show: true,
              length:30,
              length2:50
            },
            data: [
              {name:'夜间活跃',value:42},
              {name:'偏离常驻点',value:28},
              {name:'关联人员聚集',value:19},
              {name:'异常消费',value:15},
              {name:'频繁更换住址',value:12},
              {name:'未按时报到',value:8},
            ]
          }
        ]
      }
      chart.setOption(option)
    }
  },
  mounted(){
    this.initChart()
  }
}
</script>
<style scoped lang="scss">
.abnormal-behavior-type{
  width: 100%;
  height: 100%;
  .chart{
    width: 100%;
    height: 100%;
  }
}
</style>
